<template>
  <div>
    <Nav>登录页面</Nav>
    <p>昵称:<input type="text" v-model="nc" placeholder="请输入昵称" /></p>
    <p>手机号:<input type="text" v-model="sjh" placeholder="请输入手机号" /></p>
    <p>密码:<input type="text" v-model="mm" placeholder="请输入密码" /></p>
    <button :disabled="disabled" @click="dl">登录</button>
  </div>
</template>
<script>
import  Nav   from  "../components/nav";
export default {
  components:{
   Nav,
  },
data(){
  return{
   nc:"",
   sjh:"",
   mm:"",
   disabled:true
  }
},
methods:{
  // 登录
  dl(){
    var  reg1=/^1(3[0-9]|4[5,7]|5[0,1,2,3,5,6,7,8,9]|6[2,5,6,7]|7[0,1,7,8,6]|8[0-9]|9[1,8,9])\d{8}$/;
    var   reg2=/^\d{6}$/;
    if(!reg1.test(this.sjh)){
        this.$loading.show("手机号不正确");
        setTimeout(()=>{
            this.$loading.hide()
        },2000)
    }else  if(!reg2.test(this.mm)){
    this.$loading.show("密码错误密码不能低于六位");
        setTimeout(()=>{
            this.$loading.hide()
        },2000)
    }
    this.$router.push({path:"/About"});
    this.$store.commit("shop/add",this.nc)
  }
},
watch:{
  nc(){
    if(this.nc&&this.sjh&&this.mm){
      this.disabled=false;
    }else{
      this.disabled=true;
    }
},   sjh(){
    if(this.nc&&this.sjh&&this.mm){
      this.disabled=false;
    }else{
      this.disabled=true;
    }
  },
     mm(){
    if(this.nc&&this.sjh&&this.mm){
      this.disabled=false;
    }else{
      this.disabled=true;
    }
  }
}
}
</script>
<style scoped>
p {
  margin: 30px;
}
input {
  margin-left: 10px;
  padding-left: 10px;
}
button {
  margin-left: 30px;
}
</style>